import { Component, OnInit } from '@angular/core';
import { Router, NavigationExtras,ActivatedRoute } from '@angular/router';
import {TranslateService} from '@ngx-translate/core';
import { DefaultLanguageService } from '@services/default-language.service';
import {CustomToastProviderService} from '@common-components/common-toast/custom-toast-provider.service';
import { AuthTokenService } from '@services/auth-token.service';
import { HttpClient, HttpHeaders, HttpErrorResponse } from "@angular/common/http";
import { CommonResponse,VerificationType,ToastColor,CommonService,AutoLoginType } from '@services/common-service.service';
@Component({
  selector: 'app-myaccount',
  templateUrl: './myaccount.page.html',
  styleUrls: ['./myaccount.page.scss'],
})
export class MyaccountPage implements OnInit {

  public i18n:any = {};

  public bankAccounts:Array<any> = [];
  appUserId = this.authTokenService.getAppUserId();
  public appUser:any = {
    mobileNumber:'',
    faceIdLogin:false,
    fingerPrintLogin:false,
    email:''
  };
  constructor(
    private translate: TranslateService,
    private defaultLanguageService:DefaultLanguageService,
    private customToast:CustomToastProviderService,
    private route : ActivatedRoute,
    private router: Router,
    private authTokenService:AuthTokenService,
    public http: HttpClient,
    private commonService:CommonService) {
    this.i18n = this.commonService.initTranslate(['myAccount']); 

    this.route.queryParams.subscribe((data)=>{
      if(data.removeSuccess){
        this.customToast.show({
          icon:true,
          iconSuccess:true,
          message:'Removed Successfully',
          duration:2000
        });
      }
    });

    let result = this.commonService.getAppUser(this.appUserId);
    result.subscribe((response:CommonResponse)=>{
      if(response.isSuccess){
        this.appUser = response.responseBody;
      }
    });
  }

  ngOnInit() {
    this.route.data.subscribe((obj) => {
      if(obj.data instanceof HttpErrorResponse){
        this.commonService.errorRespCommonToast(obj.data,this.i18n);
        return false;
      }
      let bankAccountResp = obj.data.responseBody.banks;
      if(bankAccountResp && bankAccountResp.length>0){
        bankAccountResp = bankAccountResp.splice(0,3);
        let colorList = ['#3aa6ee','#eca231','#ec3150'];
        for(let i = 0;i<bankAccountResp.length;i++){
          bankAccountResp[i].backgroundColor = colorList[i];
          if(bankAccountResp[i].accountType == 0){
            bankAccountResp[i].cardType = 'Debit Card';
          }else if(bankAccountResp[i].accountType == 1){
            bankAccountResp[i].cardType = 'Crebit Card';
          }
        }
        this.bankAccounts = bankAccountResp;
      }
    });
  }

  toStatement(){
    this.router.navigate(['/tabs/myAccount/statement']);
  }

  toRepayment(event:any){
    event.stopPropagation();
    this.router.navigate(['/tabs/myAccount/repayment']);
  }
  toBankAccountView(){
    this.router.navigate(['/tabs/myAccount/bank-account']);
  }
  toSettingPage(){
    this.router.navigate(['/tabs/myAccount/setting']);
  }
  
  toNotification(){
    this.router.navigate(['/notifications']);
  }

  toInstallment(event){
    event.stopPropagation();
    this.router.navigate(['/tabs/myAccount/installment']);
  }

  cardClick(card){
    let index = this.bankAccounts.indexOf(card);
    this.bankAccounts.splice(index,1);
    this.bankAccounts.push(card);
  }

}
